<!--
/**
* @author xuyh0817
* @email xuyh0817@foxmail.com
* @date 2022-03-20 22:18
* @version 2.0.0
* @doc todo
* @website todo
* @remark  如果要分发源码，需在本文件顶部保留此文件头信息！！
*/
-->
<template>
  <!--  布局的整体插槽-->
  <x-render-extend-slot
    v-if="hasSlot(attrs.layoutName)"
    :componentFunc="getSlot(attrs.layoutName)"
    :data="attrs"
  ></x-render-extend-slot>

  <div v-else class="x-custom-container">
    <x-render-form-row
      :data="children"
      v-on="$listeners">
    </x-render-form-row>
  </div>
</template>

<script>
import { XRenderComponentMixin, XRenderExtendSlotMixin } from '../../../src/index'

export default {
  name: 'XRenderCustomContainer',
  mixins: [XRenderComponentMixin, XRenderExtendSlotMixin],
  computed: {
    name: {
      get() {
        const { attrs } = this
        return attrs.name || '测试'
      }
    },
    children: {
      get() {
        const { attrs } = this
        return attrs.children[0].children || []
      }
    }

  }
}
</script>

<style scoped lang="css">
.x-custom-container {
  width: 100%;
  min-height: 100px;
  display: flex;
  flex-flow: column nowrap;
}

</style>
